<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="vue.js"></script>
</head>
<body>
<div id="root">
  <p style="color:green;">123</p>

  <p :style="one">222</p>
  <p :style="'background:green;'">333</p>
  <p :style=one>444</p>

  <p :style="{background:'red',color:'green',fontSize:'30px'}">555</p>
  <p :style="obj">666</p>
</div>
</body>
<script>
  new Vue({
    el:"#root",
    data:{
      one:"background:yellow;color:red;",
      obj:{
        color:"green",
        background:"yellow"
      },
      obj2:{
        fontSize:"40px"
      },
      arr:[
        {
          background:"yellow"
        },{
          color:"green"
        }
      ]
    }
  })
</script>
</html>